// import { array } from "prop-types"
import {  useState} from "react";

function App(params) {
/**
 * useState钩子函数
 * 定义任何类型的变量
 * 语法：const[变量，修改变量的方法]=useState(变量的默认值)
 */
// 简单类型
  const [num,fn]=useState(10)
  console.log('变量',num);// [1000, ƒ]
  const [isShow,setShow]=useState(true)

  // 复杂类型
const [obj,setObj]=useState({
  name:'zs',
  age:10
})
const[arr,setArr]=useState([1,2,3])
  // 修改变量
const add=()=>{
  // 调用方法传入新值
  fn(num+1)
  setShow(!isShow)
  setObj({
        ...obj,
    age:10
  })
  setArr([
    ...arr,
    4
  ])
}

  return (
    <div>
      <h1>
        useState钩子函数
      </h1>
      <hr />
      <ul>
        <li>{isShow?'true':'false'}</li>
        <li>{num}</li>
        <li>{obj.name}-{obj.age}</li>
        <li>{arr.join('-')}</li>
        <li><button onClick={add}>btn</button></li>
      </ul>
    </div>
  )
}

export default App


